Tack.Pane.Properties = new Class({
	Extends: Tack.Pane,
	
	initialize: function (sidebar) {
		this.parent(sidebar, 'Properties');
		
		this.html.main.addClass('properties');
		this.html.main.adopt(
			this.html.fields = new Element('div', { 'class': 'fields' })
		);
	},

	refresh: function () {
		var h = this.html, o = this.object, t = this.sidebar.tack;
		var startingScene;

		h.fields.empty();
		if (o instanceof Tack.Game) {
			h.fields.adopt(
				new Element('p', { 'class': 'title' }).adopt(
					new Element('label', { text: 'Title' }),
					new Element('input', {
						events: {
							change: function () {
								o.title = this.get('value');
								t.refresh();
							}
						},
						value: o.title
					})
				),
				new Element('p', { 'class': 'starting-scene' }).adopt(
					new Element('label', { text: 'Starting scene' }),
					startingScene = new Element('select', {
						events: {
							change: function () {
								o.startingScene = o.scenes[this.get('value')];
							}
						}
					})
				),
				new Element('p', { 'class': 'author' }).adopt(
					new Element('label', { text: 'Author' }),
					new Element('input', {
						events: {
							change: function () {
								o.author = this.get('value');
							}
						},
						value: o.author
					})
				),
				new Element('p', { 'class': 'description' }).adopt(
					new Element('label', { text: 'Description' }),
					new Element('textarea', {
						events: {
							change: function () {
								o.description = this.get('value');
							}
						},
						cols: 40,
						rows: 3,
						value: o.description
					})
				)
			);
			
			var scenes = o.scenes.getKeys();
			scenes.sort();
			
			for (var i = 0; i < scenes.length; i++) {
				startingScene.adopt(
					new Element('option', { selected: (o.startingScene.name == scenes[i]), text: scenes[i], value: scenes[i] })
				);
			}
		} else if (o instanceof Tack.Scene) {
			if (!t.game.scenes.hasValue(o)) {
				h.fields.adopt(
					new Element('p', { 'class': 'nothing-selected', text: 'Nothing selected.' })
				);

				return;
			}
		
			h.fields.adopt(
				new Element('ul', { 'class': 'actions' }).adopt(
					new Element('li', { 'class': 'edit-scene' }).adopt(
						new Element('a', {
							events: {
								click: function () {
									t.designer.setScene(o);
									return false;
								}
							},
							href: '#',
							text: 'Edit scene'
						})
					),
					new Element('li', { 'class': 'delete-scene' }).adopt(
						new Element('a', {
							events: {
								click: function () {
									if (o == t.game.startingScene) {
										alert('You cannot delete the starting scene.');
										return false;
									}
									
									if (confirm('Click OK to delete the selected scene.')) {
										t.game.scenes.erase(o.name);
										t.refresh();
									}

									return false;
								}
							},
							href: '#',
							text: 'Delete scene'
						})
					)
				),
				new Element('p', { 'class': 'name' }).adopt(
					new Element('label', { text: 'Name' }),
					new Element('input', {
						events: {
							change: function () {
								try {
									o.rename(this.get('value'));
									t.refresh();
								} catch (e) {
									this.set('value', o.name);
									alert(e);
								}
							}
						},
						value: o.name
					})
				)
			);
		} else {
			h.fields.adopt(
				new Element('p', { 'class': 'nothing-selected', text: 'Nothing selected.' })
			);
		}

		this.sidebar.panes.each(function (pane) {
			if (pane instanceof Tack.Pane.Explorer) {
				pane.html.objects.getElements('li').each(function (li) {
					if (li.retrieve('object') == o) {
						li.addClass('selected');
					} else {
						li.removeClass('selected');
					}
				});
			}
		});
	},

	setObject: function (object) {
		this.object = object;
		this.refresh();
	}
});
